<template>
	<view class="j-p-password">
		<view class="j-p-p-code-b" style="margin: 20rpx 0;">
			<u-input type="password" focus v-model="params.password" maxlength="20" :focus="true" placeholder="请输入长度20位字符的新的密码" />
		</view>
		<view class="j-p-p-code-b" style="margin: 20rpx 0;">
			<u-input type="password" v-model="params.againPassword" maxlength="20" :focus="true" placeholder="请再次输入密码" />
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
export default {
	data() {
		return {
			isShowKeyboard: false,
			params: {
				password: '',
				againPassword:''
			}
		};
	},
	onNavigationBarButtonTap() {
		// 重置密码
		this.postUpdatePassword();
	},
	methods: {
		// 重置密码
		postUpdatePassword(){
			
			// 判断验证码是否为空
			if (this.$u.test.isEmpty(this.params.password)) {
				this.$refs.uToast.show({
					title: '密码不能为空'
				});
				return false;
			}
			
			// 判断再次输入的密码是否为空
			if (this.$u.test.isEmpty(this.params.againPassword)) {
				this.$refs.uToast.show({
					title: '请再次输入密码'
				});
				return false;
			}
			
			// 判断验两次密码输入是否一致
			if (this.params.password != this.params.againPassword) {
				this.$refs.uToast.show({
					title: '两次输入的密码不一致'
				});
				return false;
			}
			
			this.$u.api
				.postUpdatePassword(this.params)
				.then(res => {
					console.log(res);
					this.$refs.uToast.show({
						title: '重置登录密码成功'
					});
					setTimeout(()=>{
						// 退出登录
						this.postLogout();
					},500)
				})
				.catch(err => {
					console.log(err);
				});
		},
		// 退出登录
		postLogout() {
			this.$u.api
				.postLogout()
				.then(res => {
					console.log(res);
					setTimeout(() => {
						uni.navigateBack({
							delta: 3
						});
					}, 300);
				})
				.catch(err => {
					console.log(err);
				});
		},
	}
};
</script>

<style>
page {
	background-color: #f3f3f3;
}
</style>
<style scoped lang="scss">
.j-p-password {
	.j-p-p-phone {
		padding: 25rpx;
	}

	.j-p-p-code-b {
		display: flex;
		align-items: center;
		border-radius: 14rpx;
		padding: 16rpx 30rpx;
		background-color: #ffffff;

		.j-p-p-code-btn {
			width: 195rpx;
			height: 60rpx;
			font-size: 26rpx;
		}
	}
}
</style>
